<ion-modal-view view-title="Add User" class="positive">
 <ion-header-bar class="bar-positive">
               <button  ng-click="hideaddusermodal()" class="button button-clear icon ion-ios-arrow-back"></button>
                <h1 class="title">Add User</h1>
    </ion-header-bar>
    <ion-content has-subheader="false">
        <form name="adduserform"  ng-submit="adduser(userdata)">
          <label class="item item-input">
            <span class="input-label"><b>Name</b></span>
            <input type="text" ng-model="userdata.name" name="username" placeholder="enter the user name" required>
          </label>
          <div ng-show="adduserform.$submitted || adduserform.username.$touched">
                  <p ng-show="adduserform.username.$error.required">please enter user name..</p>
          </div>
          <div class="item row" ng-click="showselectgroups()" ng-model="userdata.groups">
            <span class="input-label col"><b>Add to groups</b></span><span class="col input">{{place_selectgroups}}</span>
          </div>        
          <button class="button button-block button-positive" type="submit">ADD</button>
        </form>
    </ion-content>
</ion-modal-view>
<script id="selectgroups.html" type="text/ng-template">
      <div class="modal">
        <ion-header-bar class="bar-positive">
                <button ng-click="hideselectgroups()" class="button button-clear button-icon ion-ios-arrow-back"></button>
                <h1 class="title">Select groups</h1>
                <button ng-click="validateselectgroups()" class="button button-clear icon  ion-checkmark"></button>
        </ion-header-bar>
        <ion-content padding="true" class="has-header">
              <ion-checkbox ng-repeat="group in groups" ng-model="formdata.selectgroups[group.id]" class="item tem-text-wrap">{{group.name}}</ion-checkbox>
        </ion-content>
      </div>
</script>
      